<template>
    <div class="home">
      <!-- 菜单风格一 -->
      <!--<van-row>-->
      <!--<van-col span="12" style="" v-for="(item,index) in useList" :key="index" style="border-right:1px solid #D9D9D9;-->
<!--border-bottom:1px solid #D9D9D9;padding:30px 0;">-->
      <!--<van-button  @click="test(item.url)" :style="{backgroundColor:item.bgColor}" style="padding:0 10px">-->
      <!--<i class="iconfont home-icon"  :class="item.icon" style=""></i>-->
      <!--</van-button>-->
      <!--<p style="margin:2px;font-size:14px;">{{item.title}}</p>-->
      <!--</van-col>-->
      <!--</van-row>-->

      <!--<van-button @click="program">跳转小程序</van-button>-->
      <!-- 菜单风格三 -->
      <van-row>
        <van-col span="12"  v-for="(item,index) in useList" :key="index" class="menu-list" style="">

            <van-button class="home-van-button"  @click="test(item.url)">
              <div class="home-icon-span" >
                <i class="iconfont home-icon"  :class="item.icon" :style="{color:item.bgColor}" ></i>
              </div>
              <p style="margin:2px;line-height: 20px;">{{item.title}}</p>
            </van-button>
        </van-col>
      </van-row>

      <!--<a href="https://www.baidu.com">跳转</a>-->
      <!-- 菜单风格二 -->
      <!--<van-row>-->
        <!--<van-col span="8" style="margin:10px 0;" v-for="(item,index) in useList" :key="index">-->
          <!--<van-button style="background: #16B3E1;color:#fff;padding:0 10px;background: linear-gradient(#F5B665,#BE8B55);border-radius: 8px;" @click="test(item.url)">-->
            <!--<i class="iconfont" :class="item.icon" style="font-size:30px;color:#fff;"></i>-->
          <!--</van-button>-->
          <!--<p style="margin:2px;font-size:14px;">{{item.title}}</p>-->
        <!--</van-col>-->
      <!--</van-row>-->

      <!--<button @click="reFn">注册</button>-->

    </div>
</template>

<script>

    export default {
        name: "home",
      data(){
          return {
            list:[
              {
                title:"会员查询",
                url:"member",
                icon:"icon-huiyuanchaxun",
                bgColor:'#F5B665',
              },
              {
                title:"会员生日",
                url:"birthday",
                icon:"icon-huiyuanshengritixing",                bgColor:'#1488F4',
              },
              {
                title:"库存",
                url:"stock",
                icon:"icon-kucun2",
                bgColor:'#FF8122',
              },
              {
                title:"经销商列表",
                url:"customer",
                icon:"icon-jingxiaoshang1",
                bgColor:'#BE8B55',
              },
              {
                title:"经销商账户",
                url:"customerAccount",
                icon:"icon-zhanghu2",
                bgColor:'#F57E20',
              },
              {
                title:"跨级统计",
                url:"crossLevelSupervise",
                icon:"icon-jianguan",
                bgColor:'#FF0000',
              },
              {
                title:"经销商统计",
                url:"dealerStatistics",
                icon:"icon-tongji",
                bgColor:'#3C8DBC',
              },
              {
                title:"考勤记录",
                url:"record",
                icon:"icon-tubiaozhizuomoban-",
                bgColor:'#01C700',
              },
              {
                title:"考勤打卡",
                url:"attend",
                icon:"icon-tubiaozhizuomoban-",
                bgColor:'#01C700',
              }
            ],
            list2:[
              {
                title:"会员查询",
                url:"member",
                icon:"icon-huiyuanchaxun",
                bgColor:'#F5B665',
              },
              {
                title:"会员生日",
                url:"birthday",
                icon:"icon-huiyuanshengritixing",                bgColor:'#1488F4',
              },
              {
                title:"库存",
                url:"stock",
                icon:"icon-kucun2",
                bgColor:'#FF8122',
              },
              {
                title:"考勤记录",
                url:"record",
                icon:"icon-tubiaozhizuomoban-",
                bgColor:'#01C700',
              },
              {
                title:"考勤打卡",
                url:"attend",
                icon:"icon-tubiaozhizuomoban-",
                bgColor:'#01C700',
              }
            ],
            useList:[],
            cols:3,
            sys: {}
          }
      },
      methods:{
        program(){
          // small_program
          wx.miniProgram.switchTab({
            url:'/pages/home/main'
          })
        },
        test(url){
          this.$router.push({ name: url});
        },
        reFn(){
          this.$router.push({name: 'registers'});
        }
      },
      mounted(){
        //localStorage.clear();
        var empId = localStorage.getItem('empId');
        // console.log(empId)
        // console.log(parseInt(localStorage.getItem("type")))
        if (!parseInt(empId)&&parseInt(localStorage.getItem("type")) == 1) {
          var len2 = this.list.length-1;
          this.list.splice(len2,1)
          this.useList = this.list;
        }else if(!parseInt(empId)&&parseInt(localStorage.getItem("type")) !=1){
          var len = this.list2.length-1;
          this.list2.splice(len,1);
          this.useList = this.list2;
        }

        if(parseInt(empId)&&parseInt(localStorage.getItem("type"))==1){//代理商员工
          // console.log(999)
          this.useList = [
            {
              title:"会员查询",
              url:"member",
              icon:"icon-huiyuanchaxun",
              bgColor:'#F5B665',
            },
            {
              title:"会员生日",
              url:"birthday",
              icon:"icon-huiyuanshengritixing",                bgColor:'#1488F4',
            },
            {
              title:"库存",
              url:"stock",
              icon:"icon-kucun2",
              bgColor:'#FF8122',
            },
            {
              title:"经销商列表",
              url:"customer",
              icon:"icon-jingxiaoshang1",
              bgColor:'#BE8B55',
            },
            {
              title:"经销商账户",
              url:"customerAccount",
              icon:"icon-zhanghu2",
              bgColor:'#F57E20',
            },
            {
              title:"跨级统计",
              url:"crossLevelSupervise",
              icon:"icon-jianguan",
              bgColor:'#FF0000',
            },
            {
              title:"经销商统计",
              url:"dealerStatistics",
              icon:"icon-tongji",
              bgColor:'#3C8DBC',
            },
            {
              title:"考勤打卡",
              url:"attend",
              icon:"icon-tubiaozhizuomoban-",
              bgColor:'#01C700',
            }
          ];
        } else if (parseInt(empId)&&!parseInt(localStorage.getItem("type"))) {//经销商员工
          this.useList = [
            {
              title:"会员查询",
              url:"member",
              icon:"icon-huiyuanchaxun",
              bgColor:'#F5B665',
            },
            {
              title:"会员生日",
              url:"birthday",
              icon:"icon-huiyuanshengritixing",                bgColor:'#1488F4',
            },
            {
              title:"库存",
              url:"stock",
              icon:"icon-kucun2",
              bgColor:'#FF8122',
            },
            {
              title:"考勤打卡",
              url:"attend",
              icon:"icon-tubiaozhizuomoban-",
              bgColor:'#01C700',
            }
          ];
        }
        // console.log(this.useList)
      }
    }
</script>

<style scoped>
  .home{
    margin-bottom:47px;
  }
  .home p{
    margin:0;
  }

  .home .iconfont{
    font-size:24px;
  }
  a{
    color: unset;
  }
  .home-icon{
    font-size:36px!important;
  }
  .home-van-button{
    border-radius: 0;
    width:100%;
    padding:45px 0;
    border:0;
    height:auto;
    line-height: initial
  }
  .icon-huiyuanchaxun{
    color: #F5B665;
  }
  .icon-kucun2{
    color:#FF8122;
  }
  .icon-jingxiaoshang1{
    color:#BE8B55;
  }
  .icon-zhanghu2{
    color:#F57E20;
  }
  .icon-jianguan{
    color:red;
  }
  .weui-grid:before{
    border-right:0;
  }
  .weui-grid:after{
    border-bottom: 0;
  }
  .home-icon-span{
    width:50px;
    margin:0 auto;
    padding: 5px 0;
  }
  .menu-list{
    border-right:1px solid #D9D9D9!important;
    border-bottom:1px solid #D9D9D9!important;

    /*background: #fff;*/
  }

  @media (min-width: 768px) {
    .home-icon{
      font-size:50px!important;
    }
    /*.menu-list{*/
      /*border-right:1px solid #D9D9D9;*/
      /*border-bottom:1px solid #D9D9D9;*/
      /*background: red;*/
    /*}*/
  }
</style>
